<template>
	<view class="head">
		<view class="">
			<el-button plain @click="onClick" size="mini" icon="el-icon-refresh">刷新</el-button>
			<el-checkbox v-if="isCocosGame" v-model="isPause" :label="isPause ? '恢复':'暂停'" border size="mini" @change="changePause"></el-checkbox>
			<!-- <el-button plain @click="onClickLookGamelayer" size="mini" v-if="isCocosGame" class="u-m-l-10">Gamelayer</el-button>
			<el-button plain @click="onClickLookRoll" size="mini" v-if="isCocosGame" class="u-m-l-10">滚轴</el-button>
			<el-button plain @click="onClickMoreDrawer" size="mini" v-if="isCocosGame">更多</el-button> -->
		</view>
		<view class="head-m-btn">
			<image class="head-m-image" src="../../static/gitee.png" mode="" @click="onOpenGitee"></image>
		</view>
		

	</view>
</template>

<script>
	import {
		mapState
	} from 'vuex';
	import injectScript from '../../store/injectScript.js'
	export default {
		name: "ui-head",
		computed: {
			...mapState({
				isCocosGame: state => state.app.isCocosGame
			}),
		},
		data() {
			return {
				isPause: false
			};
		},
		methods: {
			onClickLookGamelayer(){
				let value = "CommonMainView";
				this._evalCode(
					"window.pluginLookNode(" +
					"'" + value + "'" +
					")");
				
			},
			onClickMoreDrawer(){
				this.$emit("setMoreDrawer",true);
			},
			changePause(value){
				this._evalCode(
					"window.pluginSetGamePause(" +
					"'" + value + "'" +
					")");
			},
			onClick() {
				if (process.env.NODE_ENV === 'development') {
					this.onTestData();
					this.$store.commit('SET_ISCOCOSGAME', true);
					return;
				}

				let code = injectScript.toString();
				let str = code.substr(11, code.length - 12);
				chrome.devtools.inspectedWindow.eval(str, function() {
					console.log("刷新成功!");
				});
			},
			onOpenGitee() {
				window.open('https://gitee.com/coyeking/cocos-creator-inspector');
			},
			onClickLocalhost(){
				let code = "window.pluginLocalhost()";
				chrome.devtools.inspectedWindow.eval(code);
			},
			onClickLookRoll(){
				let value = "SlotMachineView";
				this._evalCode(
					"window.pluginLookNode(" +
					"'" + value + "'" +
					")");
			},
			onTestData() {
				let testData = {
					"type": "cc_Node",
					"uuid": "5cUWX4Yh1MipGk+ssnZ/fL",
					"name": "Canvas",
					"x": 960,
					"y": 540.4931506849315,
					"zIndex": 0,
					"childrenCount": 6,
					"children": [],
					"width": 1920,
					"height": 1080.986301369863,
					"color": "#fff85f",
					"opacity": 255,
					"rotation": 0,
					"rotationX": 0,
					"rotationY": 0,
					"anchorX": 0.5,
					"anchorY": 0.5,
					"scaleX": 1,
					"scaleY": 1,
					"skewX": 0,
					"skewY": 0,
					"active": true,
					"labelData": {
						"enabled": true,
						"string": '55252255',
						"horizontalAlign": 1,
						"verticalAlign": 1,
						"fontSize": 60,
						"lineHeight": 60,
						"overflow": 1,
						"enableBold": false,
						"enableItalic": false,
						"enableUnderline": false,
						"cacheMode": false,
						"dstBlendFactor": 771
					},
					"mControllerIndex": 1,
					'animationClips':['666','88855','1242','666','88855','1242','666','88855','1242','666','88855','1242','666','88855','1242','666','88855','1242','88855','1242','666','88855','1242','666','88855','1242','88855','1242','666','88855','1242','666','88855','1242'],
					'skeletonData':{
						"animations": [
							"animation_en",
							"animation_zh"
						],
						"premultipliedAlpha": true,
						"defaultSkin": "default",
						"defaultAnimation": "animation_zh",
						"animation": "animation_zh",
						"loop": true,
						"timeScale": 1
					},
					"blockInputData":{
						"enabled":true
					},
					spriteData :{
						enabled: true,
						sizeMode: 1,
						trim: true,
						type: 1,
						dstBlendFactor: 770,
						srcBlendFactor: 770,
						fillType: 0,
						fillStart: 0,
						fillRange: 0,
						fillCenterX: 0,
						fillCenterY: 0,
					},
					maskData : {
						enabled: true,
						type: 0,
						inverted: false,
						alphaThreshold: 0.5,
						segements: 65
					}
				};
				this.$store.commit('SET_UUID', testData.uuid);
				this.$store.commit('SET_TREEITEMDATA', testData);

				let dataRoot0 = {
					type: 36,
					uuid: 'ccccccccccc',
					name: '3655',
					children: [],
					active: false,
					disabled: true,
					isBlockInput: false
				};
				let dataRoot = {
					type: 36,
					uuid: 'fsfsfsdfsd',
					name: '3655',
					children: [{
					type: 36,
					uuid: 'ccccccccccc',
					name: '3655',
					children: [],
					active: false,
					disabled: true,
					isBlockInput: false
				}],
					active: false,
					disabled: true,
					isBlockInput: true
				};
				// this.checkedData.push(dataRoot0);
				this.$store.commit('SET_RREEDATA', [dataRoot]);
				this.$store.commit('SET_CHECKDATA', [dataRoot.uuid]);
			}
		}
	}
</script>

<style lang="scss">
	.head-m-btn {
		display: flex;
		flex-direction: row;
		flex-wrap: nowrap;
		align-items: center;

		.head-m-image {
			width: 30px;
			height: 30px;
			border-radius: 20px;
		}
	}

	.head {
		justify-content: space-between;
		display: flex;
		align-items: center;
		width: 100%;
	}
	.el-checkbox{
		margin-left: 10px;
		margin-right: 0px;
	}
	.el-checkbox .el-checkbox--mini is-bordered{
		margin-left: 0px;
	}
</style>